<template>
	<view class="content">
		<f-navbar title="我的商品" fontColor="#333" fontSize="34" bgColor="#fff">
			<view class="u-flex" slot="left">
				<van-icon name="arrow-left" color="#333" size="20" />
			</view>
		</f-navbar>
		<view class="content_box">
			<view class="content_search">
				<view class="search_box">
					<image class="search-icon" src="../../../static/imgs/search_icon.png" mode=""></image>
					<input type="text" :value="searchvalue" @input="onsearch" class="search_input"
						placeholder-class="place_class" placeholder="输入商品名称进行检索">
					<view class="search_btn" @click="onsearchbtn">
						搜索
					</view>
				</view>
			</view>
			<view class="search1">

			</view>
			<scroll-view @scrolltolower="lowerBottom" scroll-y="true"
				class="scrollHeight" :style="{marginTop:0+'rpx'}" :scroll-top="scrollTop" :refresher-threshold="100"
				:refresher-triggered="triggered" :scroll-with-animation="true">
			<view class="info_box">
				<view class="info_boxtitle">
					选择店铺商品
				</view>
				<view class="info">

					<checkbox-group @change="checkboxChange">

						<view class="info_item" v-for="(item,index) in dataList" :key="index">
							<checkbox :value="item.code" :checked="item.activity_id>0" color="##FF0000" style="transform:scale(0.8)"
								class="round red" />
							<view class="info_itembox">
								<view class="info_itemimg">
									<image class="info_itemimg" :src="item.good_img" mode=""></image>
								</view>
								<view class="info_itemtxt">
									<view class="info_itemname">
										{{item.title}}
									</view>
									<view class="info_itemnumbox">
								<!-- 		<view class="info_itemnumboxL">
											销量：2000件
										</view> -->
										<view class="info_itemnumboxR">
											价格：￥{{item.rule_min_price+'-'+item.rule_max_price}}
										</view>
									</view>

								</view>
							</view>

						</view>
<!-- 						<view class="info_item">
							<checkbox value="cb1" :checked="ischecked" color="##FF0000" style="transform:scale(0.8)"
								class="round red" />
							<view class="info_itembox">
								<view class="info_itemimg">
						
								</view>
								<view class="info_itemtxt">
									<view class="info_itemname">
										2022年时尚百搭卫衣优惠促时尚百搭卫衣优惠促..
									</view>
									<view class="info_itemnumbox">
										<view class="info_itemnumboxL">
											销量：2000件
										</view>
										<view class="info_itemnumboxR">
											原价：￥20.0
										</view>
									</view>
						
								</view>
							</view>
						
						</view>
						<view class="info_item">
							<checkbox value="cb2" :checked="ischecked" color="##FF0000" style="transform:scale(0.8)"
								class="round red" />
							<view class="info_itembox">
								<view class="info_itemimg">
						
								</view>
								<view class="info_itemtxt">
									<view class="info_itemname">
										2022年时尚百搭卫衣优惠促时尚百搭卫衣优惠促..
									</view>
									<view class="info_itemnumbox">
										<view class="info_itemnumboxL">
											销量：2000件
										</view>
										<view class="info_itemnumboxR">
											原价：￥20.0
										</view>
									</view>
						
								</view>
							</view>
						
						</view>
						 -->
					</checkbox-group>
				</view>
			</view>
			</scroll-view>
			<view class="bottom_boxone">
				
			</view>
			<view class="bottom_box">
				<view class="bottom_btn" @click="onsubmit">
					保存
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import fNavbar from '@/uni_modules/f-navbar/components/f-navbar/f-navbar.vue';
	import {getGoodsAllowActivity} from '../../../utils/storeapp.js'
	export default {
		components: {
			fNavbar
		},
		data() {
			return {
				searchvalue: '', //搜索
				imgurl: getApp().globalData.imgurl,
				dataList:[],
				pages: 1, // 分页数据
				PageSize: 4, // 一页有多少数据
				total: null, // 总条数	
				triggered:false, // 设置是否下拉
				scrollTop: 0 ,
				checkedList:'',// 选中的数据code
				checked:[], //选中的数据数组
				actnum:'', // 选中的数量

			}
		},
		onLoad(options) {
			console.log(options);
			this.checkedList = options.codeData
			this.actnum = options.actnum
			this.getList(true)
		},
		methods: {
			// 点击搜索
			onsearchbtn(){
				this.getList(true)
			},
			//触底加载
			lowerBottom() {
				// 判断是否还有下一页数据
				// if (this.pages * this.PageSize >= this.total) return person.showMoreData = true
				// 让页码值自增 +1
				// console.log('999');
				// this.pages += 1
				// 重新获取列表数据
				this.getList(false)
			},
			// 下拉刷新
			getFresh() {
				this.triggered = true,
				this.getList(true)
				
			},
			// 获取数据
			getList(isPullDownRefresh){
				let currPage = 1
				if(!isPullDownRefresh) {
					currPage = this.pages+1
				} else {
					currPage = 1
				}
				getGoodsAllowActivity({
					title: this.searchvalue,
					page: currPage
				}).then(res => {
					console.log(res);
					if(res.code==1){
						
					uni.hideToast()
					const newdata = res.data.list
					if(isPullDownRefresh){
						this.dataList = newdata
						this.triggered = false
					} else{
						this.dataList=[...this.dataList,...newdata]
					}
				
					this.pages = res.data.page.current
					console.log(this.pages);
					// this.total = res.data.page.total
					}
					// this.dataList.forEach((item)=>{
					// 	if(item.activity_id>0){
					// 		this.checked.push(item)
					// 	}
						
					// })
				})
				// getGoodsNoActivity({}).then(res => {
				// 	console.log(res.data);
				// 	this.dataList = res.data.list
				
				// })
			},
			
			
			// 保存后跳转到单品活动
			onsubmit(){
				// uni.navigateTo({
				// 	url:'/pages/subPack/oddActivity/oddActivity'
				// })
				console.log('------');
				console.log(this.actnum);
				console.log(this.checked);
				console.log(this.checkedList);
				// if(this.actnum>0){
					// uni.navigateTo({
					// 	url:'/pages/subPack/moreActivity/moreActivity?codedata='+ this.checkedList+'&actnum='+this.actnum
					// })
					var pages = getCurrentPages();
					var prevPage = pages[pages.length - 2]; //上一个页面
					console.log(prevPage);		
						prevPage.$vm.actnum = this.actnum
						prevPage.$vm.codeData=this.checkedList
					   uni.navigateBack({//返回
					     delta: 1,
						 success() {
						 // 	prevPage.$vm.actnum = this.actnum
							// prevPage.$vm.codeData=this.checkedList
						 }
					   })
				// } else {
				// 	uni.showToast({
				// 		title:'请选择商品',
				// 		icon:'none'
				// 	})
				// }

			},
			// 搜索
			onsearch(e) {
				this.searchvalue = e.detail.value
			},
			// 选择
			checkboxChange(e){
				console.log(e.detail.value);
				this.checked = e.detail.value
				this.actnum = e.detail.value.length
				let data = e.detail.value.join(',')
				console.log(data);
				this.checkedList = data
				
			},
		},
	}
</script>

<style>
	page {
		background: #eee;
	}
	.scrollHeight{
		height: 90vh;
	}
	.content_search {
		width: 100%;
		height: 110rpx;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		position: fixed;
		z-index: 999;
	}

	.search_box {
		width: 691rpx;
		height: 65rpx;
		background: #FFFFFF;
		border: 1rpx solid #EF0E6C;
		border-radius: 32rpx;
		margin: 0 auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative;
	}

	.search_input {
		width: 480rpx;
		padding-left: 88rpx;
	}

	.search-icon {
		width: 36rpx;
		height: 36rpx;
		position: absolute;
		left: 30rpx;
		top: 50%;
		transform: translateY(-50%);
	}

	.place_class {
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #BBBBBB;
	}

	.search_btn {
		width: 122rpx;
		height: 64rpx;
		background: #EF0E6C;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 64rpx;
		text-align: center;
		border-top-right-radius: 32rpx;
		border-bottom-right-radius: 32rpx;
	}

	.search1 {
		height: 110rpx;
		z-index: 999;
	}

	.info_box {
		width: 690rpx;
		/* height: 1027rpx; */
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 6rpx;
		padding-bottom: 30rpx;
	}

	.info_boxtitle {
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: 600;
		color: #333333;
		padding: 20rpx;

	}

	.info_item {
		display: flex;
		align-items: center;
		margin-left: 20rpx;
		margin-top: 20rpx;
	}


	/*每个页面公共css */
	/* //设置圆角 */
	checkbox.round .wx-checkbox-input,
	checkbox.round .uni-checkbox-input {
		border-radius: 100rpx;
		border: 2rpx solid #FF0000;
	}

	/* //设置背景色 */
	checkbox.red[checked] .wx-checkbox-input,
	checkbox.red.checked .uni-checkbox-input {
		background-color: #ffffff !important;
		border-color: #FF0000 !important;
		color: #FF0000 !important;
	}

	uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked:before {
		content: '\2022';
	}

	/* //元素使用的时候就是使用 round 和 red */

	.info_itembox {
		display: flex;
		align-items: center;
	}

	.info_itemimg {
		width: 120rpx;
		height: 120rpx;
		/* background: #FF0000; */
		border-radius: 10rpx;
	}

	.info_itemtxt {
		margin-left: 21rpx;
	}

	.info_itemname {
		width: 340rpx;
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		line-height: 42rpx;
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}

	.info_itemnumbox {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 440rpx;
		margin-top: 36rpx;
	}

	.info_itemnumboxL {
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #999999;
	}

	.info_itemnumboxR {
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FF7E00;
	}
	.bottom_boxone{
		height: 108rpx;
	}
	.bottom_box{
		width: 100%;
		height: 98rpx;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		position: fixed;
		bottom: 0;
	}
	.bottom_btn{
		width: 154rpx;
		height: 60rpx;
		background: #EF0E6C;
		border-radius: 30rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 60rpx;
		text-align: center;
	}
	
	
</style>